// list.js (精简后)

document.addEventListener('DOMContentLoaded', function() {

  // 1. 获取页面上的元素
  const listContainer   = document.querySelector('.list.container');
  const searchInput     = document.querySelector('.filter .search');
  const firstBtn        = document.querySelector('.pagination .first');
  const prevBtn         = document.querySelector('.pagination .prev');
  const nextBtn         = document.querySelector('.pagination .next');
  const lastBtn         = document.querySelector('.pagination .last');
  const totalEl         = document.querySelector('.pagination .total');
  const jumpInput       = document.querySelector('.pagination .jump');
  const goBtn           = document.querySelector('.pagination .go');
  const pageSizeSelect  = document.querySelector('.pagination .pagesize');

  // 2. 定义全局参数
  let current    = 1;
  let totalPages = 1;
  let pagesize   = 12;
  let search     = '';  // 搜索关键字

  // 3. 请求商品列表
  function fetchGoods() {
    axios.get('http://localhost:8888/goods/list', {
      params: {
        current,
        pagesize,
        // 如果你需要搜索，带上search参数；否则可移除
        search
      }
    })
    .then(res => {
      if (res.data.code === 1) {
        renderGoods(res.data.list);
        renderPagination(res.data.total);
      } else {
        console.error('获取商品列表失败:', res.data.message);
      }
    })
    .catch(err => {
      console.error('商品列表请求出错:', err);
    });
  }

  // 4. 渲染商品列表
  function renderGoods(goodsList) {
    listContainer.innerHTML = '';
    if (goodsList.length === 0) {
      // 如果没数据
      listContainer.innerHTML = '<img src="../img/nothing.jpg" alt="暂无数据" style="width: 100%;">';
      return;
    }
    goodsList.forEach(goods => {
      const li = document.createElement('li');
      li.innerHTML = `
        <div class="show">
          <img src="${goods.img_big_logo}" alt="${goods.title}">
          ${goods.is_hot ? '<span class="hot">热销</span>' : ''}
          ${goods.is_sale ? '<span class="sale">折扣</span>' : ''}
        </div>
        <div class="info">
          <p class="title">${goods.title}</p>
          <p class="price">
            <span class="curr">¥ ${goods.current_price}</span>
            <span class="old">¥ ${goods.price}</span>
          </p>
        </div>
      `;
      // 点击跳转详情
      li.addEventListener('click', () => {
        window.location.href = `detail.html?id=${goods.goods_id}`;
      });
      listContainer.appendChild(li);
    });
  }

  // 5. 渲染分页
  function renderPagination(total) {
    totalPages = total;
    totalEl.textContent = `${current} / ${totalPages}`;
    // 首页/上一页是否禁用
    if (current === 1) {
      firstBtn.classList.add('disable');
      prevBtn.classList.add('disable');
    } else {
      firstBtn.classList.remove('disable');
      prevBtn.classList.remove('disable');
    }
    // 下一页/末页是否禁用
    if (current === totalPages) {
      nextBtn.classList.add('disable');
      lastBtn.classList.add('disable');
    } else {
      nextBtn.classList.remove('disable');
      lastBtn.classList.remove('disable');
    }
  }

  // 6. 绑定事件
  // 搜索
  if (searchInput) {
    searchInput.addEventListener('input', () => {
      search = searchInput.value.trim();
      current = 1;
      fetchGoods();
    });
  }

  // 首页/上一页/下一页/末页
  if (firstBtn) {
    firstBtn.addEventListener('click', () => {
      if (current !== 1) {
        current = 1;
        fetchGoods();
      }
    });
  }
  if (prevBtn) {
    prevBtn.addEventListener('click', () => {
      if (current > 1) {
        current--;
        fetchGoods();
      }
    });
  }
  if (nextBtn) {
    nextBtn.addEventListener('click', () => {
      if (current < totalPages) {
        current++;
        fetchGoods();
      }
    });
  }
  if (lastBtn) {
    lastBtn.addEventListener('click', () => {
      if (current !== totalPages) {
        current = totalPages;
        fetchGoods();
      }
    });
  }

  // 跳转
  if (goBtn) {
    goBtn.addEventListener('click', () => {
      const num = parseInt(jumpInput.value, 10);
      if (num >= 1 && num <= totalPages) {
        current = num;
        fetchGoods();
      } else {
        alert('页码超出范围');
      }
    });
  }

  // 每页显示数量
  if (pageSizeSelect) {
    pageSizeSelect.addEventListener('change', () => {
      pagesize = parseInt(pageSizeSelect.value, 10);
      current = 1;
      fetchGoods();
    });
  }

  // 7. 首次拉取商品
  fetchGoods();
});
